import React, { useState, useEffect } from 'react'
import { Input, Radio, View, RadioGroup, Text } from '@tarojs/components'
import { AtImagePicker, } from 'taro-ui'
import { upload } from '@/utils/upload'
import "taro-ui/dist/style/components/image-picker.scss";
import "taro-ui/dist/style/components/icon.scss";
const Upload = (props) => {
    const { data = {}, index, ChangeValue } = props
    const {
        title,
        label,
        require = false,
        desc,
        value = [],
        maxLength = 1
    } = data
    console.log(data, 'file')

    const onChange = async (e) => {
        const list = e.map(item => {
            return item.url
        })
        const image = await upload(list)
        ChangeValue({ index, value: { value: image } })
    }
    return <View className='CollectWps_box_content'>
        <View className='CollectWps_label'>{require && <Text style={{ color: "red", right: 4 }}>*</Text>}{label}</View>
        <View className='CollectWps_desc'>{desc}</View>
        <View className=''>
            <AtImagePicker
                length={maxLength}
                files={value.map(val => {
                    return {
                        url: val
                    }
                })}
                multiple={true}
                showAddBtn={true}
                onChange={onChange}
            />
        </View>
    </View>
}
export default Upload